<template>
  <div class="swip">
		<div class="banner">
			<swiper :options="swiperOption" ref="mySwiper">
				<swiper-slide v-for="x in swiplist">
					<img :src="x.iswip_src"/>
				</swiper-slide>
				<div class="swiper-pagination" slot="pagination"></div>
			</swiper>
		</div>
  </div>
</template>

<script>
import {swiper,swiperSlide} from 'vue-awesome-swiper'
export default {
  name: 'swip',
  props: ['swiplist'],
  data () {
    return {
      swiperOption: {
		loop: true,
		initialSlide: 1,
      	gradCursor: true,
      	pagination: '.swiper-pagination',
      	paginationClickable: true
      }
    }
  },
  components: {
  	swiper,
  	swiperSlide
  }
}
</script>

<style scoped>
	.banner{
		width: 100%;
	}
	.swiper-slide{
		height: 100%;
	}
	.swiper-slide img{
		width: 100%;
	}
</style>